<template>
	<view class="body">
		<!-- 月初计划任务(组员上传附件) -->
		<myHeader :title="title"></myHeader>
		<view class="p-20">
			<uni-forms-item label="任务名称" name="name">
				<uni-easyinput type="text" v-model="data.taskName" disabled />
			</uni-forms-item>
			<uni-forms-item label="执行人" name="name">
				<uni-easyinput type="text" v-model="data.executorName" disabled />
			</uni-forms-item>
			<uni-forms-item label="电话" name="name">
				<uni-easyinput type="text" v-model="data.phone" disabled />
			</uni-forms-item>
			<uni-forms-item label="分数" name="name">
				<uni-easyinput type="text" v-model="data.taskScore" disabled />
			</uni-forms-item>
			<uni-forms-item label="状态" name="name">
				<uni-easyinput type="text" v-model="data.statusLabel" disabled />
			</uni-forms-item>
			<!-- 图片上传 -->
			<uni-file-picker v-if="data.status != 1" limit="1" :auto-upload="true" mode="list" file-mediatype="all" @select="select">
			</uni-file-picker>
			<progress v-if="progressVal != 0" activeColor="#4CAF50" :percent="progressVal" stroke-width="10"></progress>
		</view>
		<button  v-if="data.status != 1"  class="m-20 bg-red text-white" @click="submit">提交</button>
	</view>
</template>

<script>
	import myHeader from '../../components/head.vue'
	import NetWorkTool from '@/api/netWorkTool'
	import axios from 'axios'
	export default {
		data() {
			return {
				title: '完成任务',
				imageValue: [],
				formData: {
					name: '火星探索',
					creator: '李云龙',
					status: '待完成'
				},
				// 任务id
				id: '',
				// 月计划id
				startMonthId: '',
				// 文件上传后的url
				fileUrl: '',
				// 文件类型
				fileType: ".pdf,.doc,.docx",
				progressVal: 0,
				// 从详情页面传过来的data
				data: {},
			}
		},
		onLoad: function(option) {
			this.startMonthId = option.startMonthId;
			this.data = JSON.parse(option.data);
		},
		mounted() {},
		methods: {
			// 通过id查询任务详情
			// NetWorkTool
			submit() {
				let param = {
					"file": this.fileUrl,
					"pid": this.data.pid,
					"id": this.data.id,
					"startMonthId": this.startMonthId,
					"taskScore": this.data.taskScore,
				}
				NetWorkTool.POST('/api/federation-start-month/finishTask',param,false).then(res=>{
					uni.showToast({
						title: res.message,
						duration: 2000
					});
					this.formData = {};
					this.fileUrl = '';
					uni.navigateTo({
						url: './monthStartPlan'
					})	
				})
			},
			// 获取上传状态
			select(e) {
				let source = e.tempFiles[0];
				let token = '';
				uni.getStorage({
					key: 'AuthToken',
					success(e) {
						token = e
					}
				})
				const uploadTask = uni.uploadFile({
					url: '/api/uploadFile', //仅为示例，非真实的接口地址
					filePath: e.tempFilePaths[0],
					name: 'file',
					header: {
						'x-access-token': token.data
					},
					formData: {
						'name': source.name,
						'size': source.size
					},
					success: (res) => {
						this.fileUrl = JSON.parse(res.data).data.url;
						uni.showToast({
							title:"上传成功",
							duration: 2000
						});
					}
				});
				uploadTask.onProgressUpdate((res) => {
					this.progressVal = res.progress;
					this.fileUrl = res.url;
				});
			},
		},
		components: {
			myHeader
		},
	}
</script>

<style>
	@import url("/static/party_building/assets/style/federation.css");
</style>
